<template>
  <div>
    <div class="pageTable">
      <el-radio-group v-model="activeTab">
        <el-radio-button label="1">页面1</el-radio-button>
        <el-radio-button label="2">页面2</el-radio-button>
      </el-radio-group>
    </div>
    <div class="listTable">
      <el-table
        ref="table"
        :data="tableData"
        v-loading="tableLoading"
        height="calc(100vh - 800px)"
      >
        <el-table-column
          type="index"
          label="序号"
          :index="indexMethod"
        ></el-table-column>
        <el-table-column
          prop="name"
          label="名字"
        ></el-table-column>
      </el-table>
      <el-pagination
        :current-page="pageNo"
        :page-sizes="[1,2,3]"
        layout="total,prev,pager,next,sizes,jumper"
        :total="total"
        @current-change="handlePageChange"
        @size-change="handlePageSizeChange"
      ></el-pagination>
    </div>
  </div>
</template>

<script>
import pageTable from '@/mixins/pageTab'
import listTable from '@/mixins/listTable'
export default {
  name: 'mixins',
  mixins: [pageTable, listTable],
  data () {
    return {
      activeTab: '1',
      pageTabList: ['1', '2'],
      tableData: []
    }
  },
  computed: {},
  watch: {},
  methods: {
    getTableData () {
      let $this = this
      this.tableLoading = true
      setTimeout(() => {
        $this.tableLoading = false
        this.tableData = [{ name: '张三' }, { name: '李四' }, { name: '王五' }, { name: '赵六' }]
        this.total = 4
      }, 1000)
    }
  }
}
</script>
<style lang='less' scoped>
</style>
